<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">

    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>蜜读</title>
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <link rel="stylesheet" type="text/css" href="css/aui.css" />
    <link rel="stylesheet" type="text/css" href="css/iconfont/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="css/swiper-3.4.2.min.css" />
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
    <script src="js/art-template.js" type="text/javascript" charset="utf-8"></script>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="js/wxrem.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        document.writeln("<script type=\"text/javascript\" src=\"js/common.js?"+ Math.random() + "\"></scr"+"ipt>");
    </script>
    <style>
        #footer {
            background-color: #f2f2f2;
        }

        #footer ul li {
            background: url() no-repeat center 5px;
            text-align: center;
            color: #666666;
        }

        #footer ul li.active {
            color: #282828;
        }

        #footer ul li:nth-child(1) {
            background-image: url(icon/home.png);
        }

        #footer ul li:nth-child(2) {
            background-image: url(icon/buy.png);
        }

        #footer ul li:nth-child(3) {
            background-image: url(icon/me.png);
        }

        #footer ul li:nth-child(1).active {
            background-image: url(icon/home_hover.png);
        }

        #footer ul li:nth-child(2).active {
            background-image: url(icon/buy_hover.png);
        }

        #footer ul li:nth-child(3).active {
            background-image: url(icon/me_hover.png);
        }

        .swiper-container {
            width: 100%;
            height: 12rem;
            /*top: 12rem;*/
        }

        #tabbar {
            text-align: center;
            padding: 1.56rem 0 0 0;
            margin-left: 1.04rem;
            height: auto
        }

        #tabs div.active:after{
            width: 1.5rem;
            border-radius: 5px;
        }

        #tabs div:after{
            content: "";
            position: absolute;
            display: block;
            width: 0;
            height: .5rem;
            background-color: #282828;
            bottom: 0;
            left: 50%;
            transition: all .4s;
            transform: translate(-50%,0);
            -webkit-transform: translate(-50%,0);
        }

        .tab {
            align: center;
            height: 3.5rem;
            line-height: 3rem;
            font-weight: 500;
            color: #282828;
        }

        .command {
            font-size: 1.4rem;
            font-weight: bold;
            color: #333333;
            margin-left: 1.5rem;
            margin-right: 2rem;
            box-sizing: border-box;
            position: relative;
        }

        .aui-ellipsis-3 {
            display: -webkit-box;
            overflow: hidden;
            text-overflow: ellipsis;
            word-wrap: break-word;
            word-break: break-all;
            white-space: normal !important;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
        }

        .command:after {
            content: "";
            position: absolute;
            display: block;
            width: 0;
            height: .25rem;
            background-color: #282828;
            bottom: 0;
            left: 50%;
            transition: all .4s;
            transform: translate(-50%, 0);
            -webkit-transform: translate(-50%, 0);
        }

        .command.active:after {
            width: 2.6rem;
        }

        .follow-mask {
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            background: rgba(38,38,38,0.66);
            z-index: 100;
        }

        .activity-alertView .activity_bookView{
            position: fixed;
            padding-top: 2rem;
            padding-left: 2rem;
            background-color: white;
            border-radius: 0.78rem;
            top: 5.2rem;
            height: auto;
            left: 3.12rem;
            right: 3.12rem;
            z-index: 120;
        }

        .newUser_activity .newUser_activity_bookView {
            position: fixed;
            padding-top: 2rem;
            background-color: white;
            border-radius: 0.78rem;
            top: 10rem;
            height: 38rem;
            left: 4rem;
            right: 4rem;
            z-index: 120;
            overflow: hidden;
        }

        .activity-list ul {
            overflow: hidden;
        }

        .activity-list ul li {
            float: left;
            height: 14rem;
            width: 7.9rem;
            margin: 1.82rem 1.3rem 0 .52rem;
            position: relative;
        }

        #warn{
            background: rgba(0, 0, 0, 0.7);
            text-align: center;
            border-radius: 0.26rem;
            color: white;
            position: fixed;
            z-index: 3000;
            top: 45%;
            left: 25%;
            width: 50%;
            height: 4.16rem;
            line-height: 0.1rem;
            display: none;
            padding-top: 2.08rem;
        }

        .top-tag-container {
            padding: 11rem 1.2rem 1.56rem 1.2rem;
        }

        .top-tag-container ul {
            overflow: hidden;
        }

        .top-tag-container ul li {
            float: left;
            height: 3.6rem;
            width: 6.5rem;
            margin: 1.1rem 1.1rem 0 1.1rem;
            position: relative;
        }
        #presenter_box{
            margin-top: 11rem;
            position: relative;
        }

        .recommend_btn{
            height: 4rem;
            text-align: center;
            margin-bottom: .8rem;
            margin-top:2rem;
        }

        .presenter{
            margin: 0 auto;
            width: 13rem;
            height: 16rem;
            position: relative;
        }
        .presenter_img{
            width: 13rem;
            height: 16.9rem;
            margin: .8rem auto 0rem;
            border-radius: 4px;
            box-shadow: 0 0 8px 0.52rem #eff0f5;

        }
        .presenter_icon{
            width: 4.5rem;
            height: 4.4rem;
            position: absolute;
            right: -1.5rem;
            top: -1.5rem;
        }
        .recommend_btn p{
            display: inline-block;
            height: 3rem;
            padding: 0  1.2rem !important;
            border-radius: 10rem;
            line-height: 3rem;
            font-size: 1.5rem;
            font-weight: 500;

            margin: 1rem 0;
        }
        .bookrecommend{
            height: 5rem;
            font-size: 1.5rem;
            margin-top: 2rem;
            margin-bottom: 1rem;
        }
        .recommend_btn p:nth-child(1){
            background: #ffda43;
            margin-right: 1.05rem;
            color: #000;
            height: 3rem;
        }
        .recommend_btn p:nth-child(2){
            border: 1px solid #FF9D3C;
            color: #FF9D3C;
            margin-left: 1.05rem;
            height: calc(3rem - 2px) ;
            line-height:2.65rem  ;
        }
        .swiper-pagination-bullets{
            left: 120px !important;
        }
        .swiper-pagination-bullet-active{
            background: #FFDA43 !important;
        }
        .swiper-pagination-bullet{
            width: 5px !important;
            height: 5px !important;
        }
        .all_btn{
            height: 3rem;
            padding: 0 1.2rem;
            border-radius: 10rem;
            background: #ffda43;
            line-height: 3rem;
            font-weight: bold;
            color: #444444;
            float: right;
        }
        .hot p{
            width: 13rem;
        }
        .hot{
            width: auto!important;
            margin-right: 2rem!important;
        }
        .begin-read{
            position: absolute;
            right: 1rem;
            bottom: 0;
            width: 7.8rem;
            height:3rem;
            background: #f8d44c;
            border-radius: 10rem;
            text-align: center;
            color: #333333;
            font-size: 1.4rem;
            padding-top: 0.3rem;
            line-height: 2.6rem;
            font-weight: bold;
        }
        .book_bottom{
            height: 3rem;
            width: 100%;
            margin-top: 2rem;
            line-height: 3rem;
        }
        .book_price{
            font-size: 1.4rem;
            font-weight: bold;
            text-align: center;
            color: #FF9D3C;
            margin-left: 1.5rem;
            float: left;
        }
        .bookdetail{
            height:12rem;width:100%;padding: 0 1.456rem;display: flex
        }
    </style>
    <style type="text/css">
        .search-container {
            position: fixed;
            background: #FFFFFF;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 10;
            height: 4.4rem;
        }

        .search-view {
            position: absolute;
            height: 3.5rem;
            width: 92%;
            top: 1rem;
            left: 4%;
            border-radius: 0.6rem;
            background: #eee;
        }

        .search-container .search-input {
            height: 3.5rem;
            line-height: 3.5rem;
            padding-left: 3.5rem;
            font-size: 1.4rem;
            color: #999;
        }

        .search-container .search-icon {
            background: url(../img/ic_search.png) no-repeat center center;
            background-size: 100% 100%;
            width: 2.2rem;
            height: 2.2rem;
            top: .7rem;
            position: absolute;
            left: 1rem;
            overflow: hidden;
        }
    </style>
</head>

<body style="display: none;">
<div id="merchant">

</div>
<div id="main" class="flex-con" style="padding-bottom: 4.16rem;overflow: hidden;">
    <div class="search-container">
        <div class="search-view">
            <span class="search-icon"></span>
            <p class="search-input">搜作者或书名</p>
        </div>
    </div>

    <div id="tabs" style="height: 5rem;align-items: center;justify-content: space-around;font-size: 1.8rem;display: flex;background: #FFFFFF;position: fixed;top:4.4rem;width: 100%; color: #999; z-index: 99; box-shadow: 0 0.3rem 0.2rem 0.4rem #F6F6F6;">
        <div id="tab_0" class="active" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem; color: #333;font-weight: bold;">推荐</div>
        <div id="tab_1" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">职场</div>
        <div id="tab_2" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">心理</div>
        <div id="tab_3"  style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">生活</div>
        <div id="tab_4" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">小说</div>
        <div id="tab_5" style="position: relative;width: 16.6%;text-align: center;height: 100%;line-height: 5rem;">文化</div>
    </div>

    <div class="recommend">
        <!--好友助力-->
        <div class="col-xs-12" id="presenter_box"></div>
        <!--轮播图-->
        <div class="swiper-container" id="slideBox"></div>
        <div></div>
        <!--优惠券-->
        <div id="coupon_html">
        </div>
        <!--每日听书-->
        <!--		<div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
                    <div align="center" class="col-xs-12">
                        <p style="left:0;right:0;margin:3rem 0 1rem 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">每日听书</p>
                    </div>
                    <p style="margin-left: 1.5rem;font-size: 1.6rem;color: #333333;">主编推荐</p>
                </div>
                <div id="today1_html">
                </div>
                <div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
                    <p style="margin-left: 1.5rem;font-size: 1.6rem;color: #333333;">精选书单</p>
                </div>
                <div id="today2_html">
                </div>-->

        <!--蜜读小课-->
        <div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
            <div align="center" class="col-xs-12"style="margin-bottom: 2.5rem;">
                <p style="left:0;right:0;margin:3rem 0 2rem 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">蜜读小课</p>
                <p class="lookAll_smallCourse" align="right" style="font-size: 1.2rem;color: #999999; margin: -4.2rem 1rem 0 0;">查看全部</p>
                <img align="right" src="../icon/more.png" style="margin: -1.8rem -1rem 0 0; width: 2rem; height: 2rem;"/>
            </div>
        </div>
        <div id="smallCourse_html">
        </div>

        <!--精品课-->
        <div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
            <div align="center" class="col-xs-12" style="margin-bottom: 1.5rem;">
                <p style="left:0;right:0;margin:3rem 0 0 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">精品课</p>
                <p align="right" class="lookAll_course" style="font-size: 1.2rem;color: #999999; margin: -2.2rem 1rem 0 0;">查看全部</p>
                <img align="right" src="icon/more.png" style="margin: -1.8rem -1rem 0 0; width: 2rem; height: 2rem;"/>
            </div>
        </div>
        <div class="swiper-container1" id="course_html">
        </div>
        <!--必听书单-->
        <div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
            <div align="center" class="col-xs-12"style="margin-bottom: 2.5rem;">
                <p style="left:0;right:0;margin:3rem 0 2rem 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">必听书单</p>
                <p class="lookAll_list" align="right" style="font-size: 1.2rem;color: #999999; margin: -4.2rem 1rem 0 0;">查看全部</p>
                <img align="right" src="icon/more.png" style="margin: -1.8rem -1rem 0 0; width: 2rem; height: 2rem;"/>
            </div>
        </div>
        <div id="list_html">
        </div>
        <!--热听好书-->
        <div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
            <div align="center" class="col-xs-12" style="margin-bottom: 1rem;">
                <p style="left:0;right:0;margin:3rem 0 0 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">热听好书</p>
                <p align="right" class="lookAll_hot" style="font-size: 1.2rem;color: #999999; margin: -2.2rem 1rem 0 0;">查看全部</p>
                <img align="right" src="icon/more.png" style="margin: -1.8rem -1rem 0 0; width: 2rem; height: 2rem;"/>
            </div>
        </div>
        <div class="swiper-container2" id="hot_html">
        </div>
        <!--全部听书-->
        <div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
            <div align="center" class="col-xs-12"style="margin-bottom: 3rem;">
                <p style="left:0;right:0;margin:3rem 0 0 0;font-weight: bolder;font-size: 2.0rem;color: #534f4b; ">全部听书</p>
            </div>
        </div>
        <div id="book_html"></div>
    </div>

    <div class="category hide">
        <div class="top-tag-container"><ul id="TopCategory"></ul></div>
        <script type="text/html" id="TopCategory_Item">
            {{each cateArr}}
            <li>
                <p class="category_btn" id={{"cate_" + $index}} style=" border-radius: 1.8rem; width: 6.5rem;height: 3.6rem; color: #333;text-align: center;font-size: 1.3rem;line-height: 3.6rem;">{{$value.name}}</p>
            </li>
            {{/each}}
        </script>
        <div id="book_html1"></div>
    </div>
</div>

<div id="footer" class="border-t" style="position: fixed;bottom: 0;left: 0;z-index: 99;width: 100%;height: 4.9rem;">
    <ul class="flex-wrap" style="height: 4.9rem;">
        <li tapmode="hover" class="flex-con active" style="height: 4.9rem;background-size: 2rem 2rem;line-height: 7.8rem; font-size: 1.3rem;">首页</li>
        <li id="mine" tapmode="hover" class="flex-con" style="height: 4.9rem;background-size: 2rem 2rem;line-height: 7.8rem; font-size: 1.3rem;">书架</li>
        <li id="center" tapmode="hover" class="flex-con" style="height: 4.9rem;background-size: 2rem 2rem;line-height: 7.8rem; font-size: 1.3rem;">我的</li>
    </ul>
</div>
<script type="text/html" id="banner_template">
    <div class="swiper-wrapper">
        {{each data.banner_list}}
        <div class="swiper-slide bannerlist" data-bannertype="{{$value.bannertype}}" data-videoauthorid="{{$value.videoauthorid}}" data-copywriter="{{$value.copywriter}}" data-bookid="{{$value.id}}">
            <img src="{{$value.img | addUrl}}" style="width: 100%;height: 12rem;" />
        </div>
        {{/each}}
    </div>
    <div class="swiper-pagination"></div>
</script>

<!--好友助力-->
<script type="text/html" id="presenter_template">
    {{each presenter}}
    <div class="presenter" data-bookid="{{$value.bookid}}" style="">
        <img class="presenter_icon" src="img/jinri_icon.png" alt="">
        <img class="presenter_img" src="{{ $value.bookimg | addUrl}}" alt="">
    </div>
    <div class="recommend_btn">
        {{if userVip.type==1|| $value.isorder==1}}
        <p class="voiceBook_btn" data-bookid="{{$value.bookid}}" data-videoauthorid="{{$value.videoauthorid}}" data-copywriter="{{$value.copywriter}}" data-bookname="{{$value.bookname}}" data-bookimg="{{$value.bookimg}}">开始听书</p>
        {{else}}
        <p class="help_click" data-bookid="{{$value.bookid}}" data-videoauthorid="{{$value.videoauthorid}}" data-copywriter="{{$value.copywriter}}" data-bookname="{{$value.bookname}}" data-bookimg="{{$value.bookimg}}">好友助力免费</p>
        <p class="payment_click" data-bookid="{{$value.bookid}}" data-videoauthorid="{{$value.videoauthorid}}" data-copywriter="{{$value.copywriter}}" data-bookname="{{$value.bookname}}" data-bookimg="{{$value.bookimg}}">￥4.9购买</p>
        {{/if}}
    </div>

    <div class="bookrecommend">
        推荐语：{{$value.contentsummary}}
    </div>
    {{/each}}
    </div>
</script>


<!--优惠券-->
<script id="coupon_template" type="text/html">
    {{each data}}
    <div class="coupon">
        <img src="../img/coupon_bgimg.png"/ style="width: 100%;height: 11rem;">
        <div class="coupon_price">
        </div>
    </div>
    {{/each}}
</script>
<!--蜜读小课-->
<script id="smallCourse_template" type="text/html">
    {{each listArr}}
    <div class="smallCourse" style="height: 10.4rem;width:100%;padding:0 1.456rem;margin-bottom: 1rem;display: flex;" data-bookid={{$value.bookid}} data-videoauthorid={{$value.videoauthorid}} data-copywriter={{$value.copywriter}} >
        <div style="height:10rem;margin-right: 1.5rem;">
                <img src="{{$value.bookimg | addUrl}}" style="width:10rem;height:100%;border-radius: 5%/5%">
        </div>
        <div class="col-xs-8" style="position: relative;height:10rem;padding: 0.2rem 0.572rem 0.5rem 0rem;-webkit-flex: 1;flex: 1;">
            <span class="aui-ellipsis-2 " style="position: relative;left:0rem;margin: 0;font-size: 1.66rem;line-height:2rem;font-weight: bold;overflow: hidden;white-space: nowrap;text-overflow:ellipsis ;">{{$value.bookname}}</span>
            <p class="aui-ellipsis-2" style="position: relative;font-size:1.4rem;color: #666;margin-top: 0.6rem;">{{$value.bookrecommend}}</p>
            <div style="position:absolute;bottom: 0;">
                {{if $value.isorder == 1 || userVip.type == 1}}
                <p style="float:left;color: #feb255;font-size: 1.3rem;line-height: 1.3rem;margin-top: .5rem;">已购买</p>
                {{else}}
                <p style="float:left;color: #999;font-size: 1.3rem;line-height: 1.3rem;margin-top: .5rem;">{{$value.bookprice}}元/共{{$value.chaptercount}}节</p>
                {{/if}}
            </div>
        </div>
    </div>
    {{/each}}
</script>

<!--必听书单-->
<script id="list_template" type="text/html">
    {{each listArr}}
    {{if $index > 0}}
    <div onclick="goTOListDetail({{$value.themeid}})" class="" style="display:flex;height: 10.4rem;width:100%;padding:0 1.456rem;margin-bottom: 1rem;">
        <div class="" style="margin-right: 1.3rem;width: 29.999%;">
                <img src="{{$value.img | addUrl}}" style="width:10rem;height:100%;border-radius: 5%/5%">
        </div>
        <div class="" style="position: relative;height:10rem;-webkit-flex: 1;flex: 1;padding: 0.2rem 0.572rem 0.5rem 0rem;">
            <span style="display: block;width: 16rem; font-size: 1.66rem;font-weight: bold;text-overflow:ellipsis; white-space:nowrap; overflow:hidden;">{{$value.title}}</span>
            <p class="aui-ellipsis-2" style="position: relative;font-size:1.4rem;color: #666;margin-top: 0.6rem;">{{$value.contentabstract}}</p>
            <div style="position:absolute;bottom: 0;">
                <span style="float:left;color: #999;font-size: 1.3rem;line-height: 1.3rem;margin-top: .5rem;border-right:1px solid #999;padding-right: .088rem;">{{$value.book_count}}本书</span>
                <span style="float:left;color: #999;font-size: 1.3rem;line-height: 1.3rem;margin-top: .5rem;padding-left: .46rem;">{{$value.virtual_click_count | totalReadCount}}人在听</span>
            </div>
        </div>
    </div>
    {{/if}}
    {{/each}}
</script>

<!--精品课-->
<script type="text/html" id="course_template">
    <div class="swiper-wrapper">
        {{each courseArr}}
        <div class="swiper-slide" onclick="goTOThemeDetail({{$value.themeid}})">
            <div class="course_bigView" style="margin: 1.5rem 0 1.5rem 1.5rem; width: 27.2rem; height: 19.5rem;background-color: white;box-shadow: 0 0 0.52rem 0.52rem #eff0f5;border-radius: 0.5rem;">
                <img src="{{$value.bigimg | addUrl}}" style="width: 100%;height: 12rem;" />
                <p style="padding-left: 1.0rem;margin-top: 1.5rem;margin-bottom: 0; color: #333333;font-size: 1.66rem;font-weight: bold; overflow: hidden;white-space: nowrap;text-overflow:ellipsis ;">{{$value.title}}</p>
                <p style="padding-left: 1.0rem;margin-top: .6rem;margin-bottom: 0;color: #999999;font-size: 1.2rem;">{{$value.book_count + "节课 | " + $value.virtual_click_count + "人在学"}} </p>
                {{if userVip.type==1}}
                <p align="right" style="padding-right: 1.0rem;margin-top: -1.8rem;color: #999999;font-size: 1.2rem;"><s>{{"¥ " + $value.price}}</s><span style="color: #FF9D3C;font-size: 1.4rem;font-weight: bold;"> VIP ¥0</span></p>
                {{else if $value.isorder==1}}
                <p align="right" style="padding-right: 1.0rem;margin-top: -1.8rem;color: #FF9D3C;font-size: 1.4rem;">已购买</p>
                {{else}}
                <p align="right" style="padding-right: 1.0rem;margin-top: -1.8rem;color: #999999;font-size: 1.2rem;"><s>{{"¥ " + $value.original_price}}</s><span style="color: #FF9D3C;font-size: 1.4rem;font-weight: bold;">{{" ¥ " + $value.price}}</span></p>
                {{/if}}
            </div>
        </div>
        {{/each}}
    </div>
    <div class="swiper-pagination"></div>
</script>

<!--热听好书-->
<script type="text/html" id="hot_template">
    <div class="swiper-wrapper" style="padding-left: 1.5rem; ">
        {{each hotArr}}
        <div class="swiper-slide hot" data-bookid={{$value.bookid}} data-videoauthorid={{$value.videoauthorid}} data-copywriter={{$value.copywriter}} data-bookname={{$value.bookname}} data-bookimg={{$value.bookimg}} data-bookrecommend={{$value.bookrecommend}}>
            <img src="{{$value.bookimg | addUrl}}" style="margin: 2.5rem 0 0 0rem; width: 13rem; border-radius: 4px; box-shadow: 3px 3px 3px #e6e6e6;" />
            <p style="margin-top: 1.7rem; margin-bottom: 0; color: #333333;font-size: 1.66rem; font-weight: bold;overflow: hidden;white-space: nowrap;text-overflow:ellipsis ;">{{$value.bookname}}</p>
            <p style="margin-top: .3rem;  margin-bottom: 0; color: #999999;font-size: 1.2rem;">{{$value.videoduration}} </p>
            {{if userVip.type==1}}
            <p style="margin-top: 0.6rem;color: #FF9D3C;font-size: 1.4rem;font-weight: bold;">VIP ¥0 <span style="color: #999999;font-size: 1.2rem;"><s>{{"¥ " + $value.bookprice}}</s></span></p>
            {{else if $value.isorder==1}}
            <p style="margin-top: 0.6rem;color: #FF9D3C;font-size: 1.4rem;font-weight: bold;">已购买</p>
            {{else}}
            <p style="color: #FF9D3C;font-size: 1.4rem;font-weight: bold;">{{"¥ " + $value.bookprice}}</p>
            {{/if}}
        </div>
        {{/each}}
    </div>
</script>

<!--全部听书-->
<script id="book_template" type="text/html">
    {{each bookArr}}
    <div class="bookdetail" style="" data-bookid={{$value.bookid}} data-videoauthorid={{$value.videoauthorid}} data-copywriter={{$value.copywriter}} data-bookname={{$value.bookname}} data-bookimg={{$value.bookimg}} data-bookrecommend={{$value.bookrecommend}}>
        <div style="height:12rem;margin-right:1.75rem;">
                <img src="{{$value.bookimg | addUrl}}" style="width: 9.17rem;height: 12rem;box-shadow: 3px 3px 3px #e6e6e6; border-radius: 4px">
                <img src="icon/listen.png" style="width: 1.66rem; height: 1.66rem; margin-top: -1.82rem; margin-left: 7.28rem;"/>
        </div>
        <div class="" style="position: relative;height:12rem;flex:1;">
            <span class="aui-ellipsis-2 " style="position: relative;left:0rem;margin: 0;font-size: 1.66rem;line-height:2rem;font-weight: bold;">{{$value.bookname}}</span>
            <p class="aui-ellipsis-2" style="position: relative;font-size:1.4rem;color: #666;height: 4rem;margin-top: 0.78rem;margin-bottom: 0;">{{$value.bookrecommend}}</p>
            <div class="book_bottom">
                {{if progessArr}}
                {{if progessArr[$index] == 0}}
                <div style="font-size: 1.2rem;float: left">{{$value.videoduration}}</div>
                {{else}}
                <div>
                    <span>{{$value.videoduration + " " + progessArr[$index]}}</span>
                </div>
                {{/if}}
                {{else}}
                <div style="font-size: 1.2rem;float: left">{{$value.videoduration}}</div>
                {{/if}}
                {{if (userVip.type==1||$value.isorder==1)}}
                <div class="begin-read" data-isactivity={{$value.book_activity}} data-isorder={{$value.isorder}} data-bookid={{$value.bookid}}>
                    开始听书
                </div>
                {{else}}
                <div class="book_price">
                    {{"¥ " + $value.bookprice}}
                </div>
                <div class="all_btn" data-bookid="{{$value.bookid}}" data-videoauthorid="{{$value.videoauthorid}}" data-copywriter="{{$value.copywriter}}" data-bookname="{{$value.bookname}}" data-bookimg="{{$value.bookimg}}">分享免费</div>
                {{/if}}
            </div>
        </div>
    </div>
    <div class="col-xs-12" style="height: 2rem;width: 100%;"></div>
    {{if $index == (bookArr.length - 1)}}
    <div style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
        <div align="center" class="col-xs-12" style="margin-bottom: 1rem;">
            {{if isFinish == 0}}
            <p class="click_lookMore" style="margin:1.5rem 32%; height: 3.5rem; font-weight: bold; font-size: 1.3rem;color: #333333; background: #EEEEEE; padding-top: 0.8rem; border-radius: 1.75rem;">加载更多听书</p>
            {{else}}
            <p style="margin:1.5rem 0; font-size: 1.3rem;color: #CCCCCC;">已显示全部听书</p>
            {{/if}}
        </div>
    </div>
    {{/if}}
    {{/each}}
</script>
<!--赠一得一弹窗-->
<div class="activity-alertView hide">
    <div class="follow-mask"></div>
    <div class="activity_bookView hide" align="center">
        <div class="activity-list" align="center">
            <p style="font-size: 1.66rem; width: 100%; left: 0; text-align: center; font-weight: bold; color: #333333;">分享免费领</p>
            <p class="stageNum" style="font-size: 1.3rem; width: 100%; left: 0; text-align: center; color: #666666;margin-top: 0.5rem;"></p>
            <ul id="activity_book" style="margin-top: 1.2rem;"></ul>
            <div class="free_receive_btn" style="background-color: #FF9D3C; left: 0; margin-top: 3rem; margin-bottom: 1.82rem; margin-right: 2rem; height: 4rem; color: white; font-size: 1.4rem; text-align: center; border-radius: 0.3rem; padding-top: 1rem; ">免费领取</div>
        </div>
        <script type="text/html" id="activity_Item">
            {{each data.book_list}}
            <li>
                <div class="activity_Item_div">
                    <img class="activity_bookimg" src="{{$value.bookimg | addUrl}}" style="width: 8.3rem; height: 10.3rem; box-shadow: 3px 3px 3px #e6e6e6;border: 0;vertical-align: middle;"/>
                    <img src="icon/listen.png" style="width: 1.66rem; height: 1.66rem; margin-left: 5.2rem; margin-top: -2.08rem;"/>
                    <p style="font-size: 1.3rem;overflow: hidden;white-space: nowrap; text-overflow: ellipsis; width: 9.17rem; color: #333333; margin-top: 1.3rem;">{{$value.bookname}}</p>
                </div>
            </li>
            {{/each}}
        </script>
    </div>
    <img class="closeBtn" src="img/close_img.png" style="position: absolute; width: 4rem; height: 4rem; top: 3rem;right: 1rem;z-index: 125;"/>
</div>
<!--广告弹窗-->
<img id="activity_Advertisement_id" class="activity_Advertisement hide" src="" style="z-index: 120; position: fixed; left: 0; width: 100%; top: 0;height: 100%;"/>
<!--新手礼包弹窗-->
<img class="activity_newUserImgView hide" src="img/newUserImage.png" style="z-index: 120; position: fixed; left: 0; width: 100%; top: 0;height: 100%;"/>
<div class="newUser_activity hide">
    <div class="follow-mask"></div>
    <div class="newUser_activity_bookView" align="center">
        <p align="center" style="font-size: 2.0rem; color: #333333; font-weight: bold;margin-top: 0rem;">新用户专享</p>
        <p align="center" style="font-size: 1.3rem; color: #666666;margin-top: -1.0rem;margin-bottom: 2.5rem;">连续七天，每天送你一本好书</p>
        <div class="swiper-container3" id="new_html"></div>
    </div>
    <img class="closeBtn" src="img/close_img.png" style="position: absolute; width: 4rem; height: 4rem; top: 8rem;right: 2rem;z-index: 125;"/>
    <script type="text/html" id="newUser_template">
        <div class="swiper-wrapper">
            {{each data}}
            <div class="swiper-slide" style="left: 0; width: 100%; height: 25.5rem;">
                <img src="{{$value.bookimg | addUrl}}" style="width: 10rem;height: 13.2rem;" />
                <p align="center" style="font-size: 1.5rem; color: #333333; margin-top: 0.5rem;">{{$value.bookname}}</p>
                {{if $value.isorder == 1 || userVip.type == 2}}
                <div class="newUser_receiveBtn" style="left: 15%; width: 70%; height: 4.5rem; background-color: #f8d44c; color: #333333; line-height: 4.5rem; font-size: 1.5rem; border-radius: 2.25rem; margin-top: 4.0rem;">开始听书</div>
                {{else if $index == localDay - 1}}
                <div class="newUser_receiveBtn" style="left: 15%; width: 70%; height: 4.5rem; background-color: #f8d44c; color: #333333; line-height: 4.5rem; font-size: 1.5rem; border-radius: 2.25rem; margin-top: 4.0rem;">今日免费</div>
                {{else if $index < localDay - 1}}
                <div style="left: 15%; width: 70%; height: 4.5rem; background-color: #EEEEEE; color: #999999; line-height: 4.5rem; font-size: 1.5rem; border-radius: 2.25rem; margin-top: 4.0rem;">未领取</div>
                {{else}}
                <div style="left: 15%; width: 70%; height: 4.5rem; background-color: #EEEEEE; color: #999999; line-height: 4.5rem; font-size: 1.5rem; border-radius: 2.25rem; margin-top: 4.0rem;">待领取</div>
                {{/if}}
            </div>
            {{/each}}
        </div>
        <div class="swiper-pagination" style="padding-bottom: 9rem;"></div>
        <p align="center" style="font-size: 1.2rem; color: #999999;">领取成功后在「书架」查看</p>
    </script>
</div>
<!--若提示框-->
<div id="warn"></div>
<img class="showNewUser hide" src="img/newUser_icon.png" style="width: 7.5rem; height: 7.5rem; bottom: 8.2rem; right: 0; position: fixed; z-index: 80;"/>
</body>
</html>

<script src="js/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/purl.js"></script>
<script src="js/swiper-3.4.2.jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/aui-dialog.js" type="text/javascript" charset="utf-8"></script>
<script src="js/aui-toast.js" type="text/javascript" charset="utf-8"></script>
<script src="js/md5.js" type="text/javascript" charset="utf-8"></script>
<script src="http://pingjs.qq.com/h5/stats.js?v2.0.4" name="MTAH5" sid="看管理台统计代码中的sid填写" cid="如果没有cid可删除cid"></script>
<script type="text/javascript">

    var toast = new auiToast();
    var todayArr1 = new Array();//每日听书——主编推荐
    var courseArr = new Array();//精品课
    var listArr = new Array();//必听书单
    var hotArr = new Array();//热听好书
    var bookArr = new Array();//全部听书
    var smallCourseArr = new Array();//蜜读小课
    var page = 1;
    var mySwiper;
    var newUserArr = new Array();//新手礼包
    var advertisement_dict;//广告位
    var userInfo;

    var cateBookArr = new Array();
    var cateArr = new Array();

    template.defaults.imports.addFaceUrl = function(value) {
        if(value == "" || value == null) {
            return "img/book.png"
        } else {
            if(checkURL(value)) {
                return value;
            } else {
                return imgFaceurl + value
            }
        }
    };


    function goTOListDetail(id) {
        window.location.href = "listDetail.html?themeId=" + id;
    }

    function goTOThemeDetail(id) {
        window.location.href = "themeDetail.html?themeId=" + id;
    }

    $(function() {

        $('.lookAll_course').click(function(){
            window.location.href = "courseList.html";
        })

        $('.lookAll_list').click(function(){
            window.location.href = "allTheme.html";
        })

        $('.lookAll_smallCourse').click(function(){
            window.location.href = "allTheme.html?type=1";
        })

        $('.lookAll_hot').click(function(){
            window.location.href = "hotBookList.html";
        })

        $('#book_html').on('click', '.click_lookMore', function(e) {
            e.stopPropagation();
            e.cancelBubble = true;
            page ++;
            getBookListDown();
        })

        var tabSwiper = new Swiper('.tab-container', {
            direction: 'horizontal',
            onSlideChangeEnd: function(swiper) {
                var dom = $(".command");
                for(var i = 0; i < dom.length; i++) {
                    $(dom).removeClass("active");
                }
                $(dom).eq(swiper.activeIndex).addClass("active");
            },

        })

        $('body').show();

        if (localStorage.getItem("refresh")) {
            localStorage.removeItem("refresh");
        }else {
            toast.loading({
                title: "加载中",
                duration: 2000
            });
        }

//		赠一得一、新手礼包显示规则
        function getActivityRule(){
            if (window.localStorage) {//支持localStorage存储
                if (userInfo.novice && !localStorage.getItem("localDay")) {//新用户
                    localStorage.setItem("localDay","1");
                    var dateStr = new Date().toLocaleDateString();
                    localStorage.setItem("localDate",dateStr);//保存打开时的日期
                    var time = new Date().getTime();
                    localStorage.setItem("localTime",time); //保存打开时的时间
                    $('.showNewUser').removeClass('hide');//显示底部按钮
                    $('.activity_newUserImgView').removeClass('hide');//显示新手礼包图片
                }else {
                    $('.activity_newUserImgView').addClass('hide');//隐藏新手礼包图片
                    var localDay = localStorage.getItem("localDay");
                    if (localDay) {//新用户有效期内
                        $('.showNewUser').removeClass('hide');//显示底部按钮
                        var dateStr = new Date().toLocaleDateString();
                        if (localStorage.getItem("localDate") != dateStr) {//今天第一次打开
                            localDay = parseInt(localDay);
                            if (localDay >= newUserArr.length) {//超过七天
                                localStorage.removeItem("localDay");
                                localStorage.removeItem("localTime");
                                localStorage.removeItem("localDate");
                                //显示赠一得一
                                getActivityBookList();
                                $('.showNewUser').addClass('hide');//隐藏底部按钮
                            } else{
                                localDay += 1;
                                localStorage.setItem("localDay",localDay);
                                var dateStr = new Date().toLocaleDateString();
                                localStorage.setItem("localDate",dateStr);
                                var time = new Date().getTime();
                                localStorage.setItem("localTime",time);
                                //显示新手礼包
                                getNewUserBookList();
                            }
                        }else {//第二次及以上次数打开
                            var localTime = localStorage.getItem("localTime");
                            if (localTime) {
                                var now = new Date();
                                var leftTime = (now.getTime() - localTime) / 1000;
                                if (leftTime >= 3600) {//一个小时以后
                                    //显示赠一得一
                                    getActivityBookList();
                                }
                            }
                        }
                    }else {//老用户
                        localStorage.removeItem("localDay");
                        localStorage.removeItem("localTime");
                        localStorage.removeItem("localDate");
                        $('.showNewUser').addClass('hide');//隐藏底部按钮
                        //显示赠一得一
                        getActivityBookList();
                    }
                }
            }
        }


        $('.swiper-container3').on('click', function(e) {
            var dict = newUserArr[mySwiper.activeIndex];
            if (dict.isorder == 1 || userVip.type == 2) {//开始听书
                //恢复滑动效果
                document.body.style.overflow = 'auto';
                window.removeEventListener('touchmove', _preventDefault);
                $('.newUser_activity').addClass('hide');
                location.href = "chapter.html?bookid=" + dict.bookid + "&videoauthorid=" + dict.videoauthorid + "&copywriter=" + dict.copywriter + "&bookname="+ dict.bookname +"&bookimg=" + dict.bookimg;
            }else if (mySwiper.activeIndex + 1 == localStorage.getItem("localDay")) {//今日免费
                $.ajax({
                    type:"get",
                    url:hostUrl + "order/freetime?channel=weixin&type=1&userid=" + unionid + "&themeid=" + dict.bookid,
                    async:true,
                    success:function(data) {
                        //恢复滑动效果
                        document.body.style.overflow = 'auto';
                        window.removeEventListener('touchmove', _preventDefault);
                        $('.newUser_activity').addClass('hide');
                        location.href = "mine.html";
                    }
                });
            }
        })



        function getActivityBookList(){//赠一得一
            $.ajax({
                type:"get",
                url: hostUrl + "other/giveonewindow?unionid=" + unionid,
                async:true,
                success: function(data) {

                    var value = data.data.num + "_" + data.data.type;
                    var key = "activity_date_" + data.data.type;
                    var localValue;
                    if (window.localStorage) {
                        localValue = localStorage.getItem(key);
                    }else {
                        localValue = getCookie(key);
                    }
                    if (localValue == value){
                        $.ajax({
                            type:"get",
                            url:hostUrl + "other/advertisement?bannertype=13",
                            async:true,
                            success: function(data) {
                                for (var i = 0; i < data.data.length; i ++) {
                                    if (data.data[i].status == 0) {
                                        advertisement_dict = data.data[i];
                                    }
                                }
                                if (!advertisement_dict) {
                                    return;
                                }
                                if ("advertisement_" + advertisement_dict.id != localStorage.getItem("Advertisement_id")) {
                                    var localTime = localStorage.getItem("give_localTime");
                                    if (localTime) {
                                        var now = new Date();
                                        var leftTime = (now.getTime() - localTime) / 1000;
                                        if (leftTime >= 3600) {//一个小时以后
                                            localStorage.setItem("Advertisement_id","advertisement_" + advertisement_dict.id);
//											显示广告弹窗
                                            $('#activity_Advertisement_id').attr("src","http://img.readerday.com/cover/" + advertisement_dict.img);
                                            $('.activity_Advertisement').removeClass('hide');
                                        }
                                    }
                                }
                            }
                        });
                        return;
                    }

                    if (window.localStorage) {
                        var time = new Date().getTime();
                        localStorage.setItem("give_localTime",time);
                        localStorage.setItem(key,value);
                    }else {
                        setCookie(key,value);
                    }

                    $('.activity-alertView').removeClass('hide');
                    //禁止滑动
                    document.body.style.overflow = 'hidden';
                    window.addEventListener('touchmove',_preventDefault);
                    if (data.data.type == 1){// 1 书籍  2 会员
                        $('.stageNum').text("第 " + data.data.num + " 期");
                        $('.activity_bookView').removeClass('hide');
                        document.getElementById('activity_book').innerHTML = template("activity_Item", data);
                    }else{
                        $('.activity_VIPImgView').removeClass('hide');
                    }
                }
            });
        }

        function setCookie(name, value) {
            var argv = setCookie.arguments;
            var argc = setCookie.arguments.length;
            var expires = (argc > 2) ? argv[2] : null;
            if (expires!=null) {
                var LargeExpDate = new Date ();
                LargeExpDate.setTime(LargeExpDate.getTime() + (expires*1000*3600*24));
            }
            document.cookie = name + "=" + escape (value)+((expires == null) ? "" : ("; expires=" +LargeExpDate.toGMTString()));
        }

        function getCookie(Name) {
            var search = Name + "=";
            if (document.cookie.length > 0) {
                offset = document.cookie.indexOf(search);
                if (offset != -1) {
                    offset += search.length
                    end = document.cookie.indexOf(";", offset)
                    if(end == -1) end = document.cookie.length
                    return unescape(document.cookie.substring(offset, end))
                }else {
                    return "";
                }
            }
        }

        function getCouponList() {//优惠券
            $.ajax({
                type:"get",
                url:hostUrl + "order/get/coupon",
                async:true,
                success:function(data) {
                    if (data.data) {
                        var coupon = template("coupon_template",data);
                        document.getElementById('coupon_html').innerHTML = coupon;
                    }
                }
            });
        }
        getCouponList();

        function home() {
            userInfo=JSON.parse(sessionStorage.getItem('weixinData')).data.userInfo;
            var vip=sessionStorage.getItem('userVip')
            $.ajax({//页面统计
                type:"get",
                url:hostUrl + "statistics/page?type=1&channel=weixin&unionid=" + unionid,
                async:true
            });
            //订阅页面跳转
            $.ajax({
                type:"get",
                url: hostUrl + "home/subscribe/get?unionid="+ unionid ,
                async:false,
                success:function(data) {
                    console.log(typeof vip)
                    console.log(vip)
                    if(data.data==true){
                    // if(data.data==true||vip!='{}'){
                        // location.href="../index_fxs.html"
                    }else if(data.data==false){
                    // }else if(data.data==false||vip=='{}'){
                        location.href="../homeimg.html"
                    }
                }
            });




            getBookListDown();
            $.ajax({
                type: "get",
                url: ascli(hostUrl + "home?token=" + token),
                async: true,
                success: function(data) {
                    todayArr1 = data.data.book_list;
                    hotArr = data.data.book_list2;
                    courseArr = data.data.theme_list;
                    listArr = data.data.bag1;
                    smallCourseArr = data.data.smallBook;
                    shareWx("蜜读 - 解读全球经典好书", "20170922155253.png", "致力于书籍的精编解读，提炼干货让阅读省时高效。");
                    data.userVip=userVip;

//					轮播图
                    var banner_html = template("banner_template", data);
                    document.getElementById('slideBox').innerHTML = banner_html;
                    var mySwiper = new Swiper('.swiper-container', {
                        direction: 'horizontal',
                        loop: true,
                        autoplay: "3000",
                        slidesPerView: 1,
                        // 如果需要分页器
                        pagination: '.swiper-pagination',
                    })
//					每日听书
//					主编推荐
//					音频进度
                    if (window.localStorage) {
                        var progess;
                        var bookid;
                        var bookCount;
                        var progessStr;
                        var progessArr = new Array();
                        for (var i = 0; i < todayArr1.length; i ++) {
                            bookid = todayArr1[i]["bookid"];
                            bookCount = localStorage.getItem(bookid + "_count");
                            bookCount = parseInt(bookCount);
                            progess = 0;
                            if (bookCount) {
                                for (var j = 0; j < bookCount; j ++) {
                                    var value = localStorage.getItem(bookid + "_" + j);
                                    if (value) {
                                        var timeArr = value.split("_");
                                        if (timeArr.length == 2) {
                                            currentTime = parseInt(timeArr[0]);
                                            duration = parseInt(timeArr[1]);
                                            progess += parseInt((currentTime * 100) / duration);
                                        }
                                    }
                                    if (j == bookCount - 1) {
                                        if (progess == 0 || !progess) {
                                            progessStr = "0";
                                        }else {
                                            if (parseInt(progess / bookCount) >= 100) {
                                                progessStr = "已听完";
                                            } else{
                                                progessStr = "已听" + parseInt(progess / bookCount) + "%";
                                            }
                                        }
                                    }
                                }
                            } else{
                                progessStr = "0";
                            }
                            progessArr.push(progessStr);
                        }
                    }
                    data.progessArr = progessArr;
                    // 好友助力
                    data.presenter = todayArr1;
                    var pres = template("presenter_template",data);
                    document.getElementById('presenter_box').innerHTML = pres


                    /*	data.todayArr1 = todayArr1;
                        var todayHtml1 = template("today1_template",data);
                        document.getElementById('today1_html').innerHTML = todayHtml1;
    //					精选书单
                        data.listArr = listArr;
                        var todayHtml2 = template("today2_template",data);
                        document.getElementById('today2_html').innerHTML = todayHtml2;*/


                    //					精品课
                    data.courseArr = courseArr;
                    var course_html = template("course_template", data);
                    document.getElementById('course_html').innerHTML = course_html;
                    var mySwiper = new Swiper('.swiper-container1', {
                        direction: 'horizontal',
                        loop: false,
                        slidesPerView: 1.24,
                    })

//					必听书单
                    data.listArr = listArr;
                    var list_html = template("list_template", data);
                    document.getElementById('list_html').innerHTML = list_html;

//					蜜读小课
                    data.listArr = smallCourseArr;
                    var smallCourse_html = template("smallCourse_template", data);
                    document.getElementById('smallCourse_html').innerHTML = smallCourse_html;

//					热听好书
                    data.hotArr = hotArr;
                    var hot_html = template("hot_template", data);
                    document.getElementById('hot_html').innerHTML = hot_html;
                    var mySwiper = new Swiper('.swiper-container2', {
                        direction: 'horizontal',
                        loop: false,
                        slidesPerView: 'auto',
                    })

                    toast.hide();


                }
            });
        }

        getToken(home);


        function getBookListDown(){//下拉刷新
            $.ajax({
                type:"get",
                url:hostUrl + "product/book/list?unionid=" + unionid + "&rows=10&page=" + page + "&type=1",
                async:true,
                success:function(data){
                    if (data.status != 0) {
                        return;
                    }
                    if (data.data.book_list.length < 10) {
                        data.isFinish = 1;
                    }else {
                        data.isFinish = 0;
                    }
                    data.userVip=userVip;
                    for (var i = 0; i < data.data.book_list.length; i ++) {
                        bookArr.push(data.data.book_list[i]);
                    }
                    page = parseInt((bookArr.length + 9) / 10);
                    if (window.localStorage) {
                        var progess;
                        var bookid;
                        var bookCount;
                        var progessStr;
                        var progessArr = new Array();
                        for (var i = 0; i < bookArr.length; i ++) {
                            bookid = bookArr[i]["bookid"];
                            bookCount = localStorage.getItem(bookid + "_count");
                            bookCount = parseInt(bookCount);
                            progess = 0;
                            if (bookCount) {
                                for (var j = 0; j < bookCount; j ++) {
                                    var value = localStorage.getItem(bookid + "_" + j);
                                    if (value) {
                                        var timeArr = value.split("_");
                                        if (timeArr.length == 2) {
                                            currentTime = parseInt(timeArr[0]);
                                            duration = parseInt(timeArr[1]);
                                            progess += parseInt((currentTime * 100) / duration);
                                        }
                                    }
                                    if (j == bookCount - 1) {
                                        if (progess == 0 || !progess) {
                                            progessStr = "0";
                                        }else {
                                            if (parseInt(progess / bookCount) >= 100) {
                                                progessStr = "已听完";
                                            } else{
                                                progessStr = "已听" + parseInt(progess / bookCount) + "%";
                                            }
                                        }
                                    }
                                }
                            } else{
                                progessStr = "0";
                            }
                            progessArr.push(progessStr);
                        }
                    }
                    data.progessArr = progessArr;
                    data.bookArr = bookArr;
                    var book_html = template("book_template", data);
                    document.getElementById('book_html').innerHTML = book_html;
                }
            });
        }

        $('.search-container').on('click', function() {
            location.href = "searchPage.html"
        })

        $("#main").on('click', '.bookdetail', function() {
            window.location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid') + "&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
        })

        $("#main").on('click', '.smallCourse', function() {
            window.location.href = "smallCourseDetail.html?bookid=" + $(this).attr('data-bookid') + "&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
        })

        $("#main").on('click', '.coupon', function() {
            $.ajax({
                type:"get",
                url:ascli(hostUrl+"order/receive/coupon?token=" +token),
                async:true,
                success: function(data){
                    if (data.status == 0) {
                        weekTip("领取成功");
                    } else{
                        weekTip("您的优惠券已领完");
                    }
                }
            });
        })

        $("#main").on('click', '.bannerlist', function() {
            if($(this).attr('data-bannertype') == "6") { //主题
                window.location.href = "themeDetail.html?themeId=" + $(this).attr('data-bookid');
            } else if($(this).attr('data-bannertype') == "9") { //单本
                window.location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid') + "&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
            }else if($(this).attr('data-bannertype') == "7"){//会员
                window.location.href = "memberPage.html";
            }else if($(this).attr('data-bannertype') == "11"){//赠一得一活动
                window.location.href = "activity_freeReceive.html";
            }else if($(this).attr('data-bannertype') == "12"){//书单
                window.location.href = "listDetail.html?themeId=" + $(this).attr('data-bookid');
            }else if($(this).attr('data-bannertype') == "8"){
                window.location.href = "smallCourseDetail.html?bookid=" + $(this).attr('data-bookid') + "&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
            } else {
                weekTip("功能开发中，敬请期待！");
                return;
            }
        })

        $("#main").on('click', '.hot', function() {
            window.location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid') + "&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
        })

        $('#today1_html').on('click', '.begin-read', function(e) {
            e.stopPropagation();
            e.cancelBubble = true;
            var parent = $(this).parents('.bookdetail')
            location.href = "chapter.html?bookid=" + parent.attr('data-bookid') + "&videoauthorid=" + parent.attr('data-videoauthorid') + "&copywriter=" + parent.attr('data-copywriter') + "&isorder=1&bookname="+parent.attr('data-bookname')+"&bookimg=" + parent.attr('data-bookimg');
        })

        $('#book_html').on('click', '.begin-read', function(e) {
            e.stopPropagation();
            e.cancelBubble = true;
            var parent = $(this).parents('.bookdetail')
            location.href = "chapter.html?bookid=" + parent.attr('data-bookid') + "&videoauthorid=" + parent.attr('data-videoauthorid') + "&copywriter=" + parent.attr('data-copywriter') + "&isorder=1&bookname="+parent.attr('data-bookname')+"&bookimg=" + parent.attr('data-bookimg');
        })

        // 好友助力点击听书
        $(document).on('click', '.voiceBook_btn', function() {
            location.href = "chapter.html?bookid=" +  $(this).attr('data-bookid') + "&videoauthorid=" +  $(this).attr('data-videoauthorid') + "&copywriter=" +  $(this).attr('data-copywriter') + "&isorder=1&bookname="+ $(this).attr('data-bookname')+"&bookimg=" +  $(this).attr('data-bookimg');
        })
        // 好友助力点击购买
        $(document).on('click', '.payment_click', function() {
            payClick(JSON.parse(window.sessionStorage.getItem("weixinData")), 2, $(this).data('bookid'), false);
        })
        $(document).on('click', '.presenter', function() {
            location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid');
        })
        // 好友助力点击分享
        $(document).on('click', '.help_click', function() {
            MtaH5.clickStat("home_share")//统计点击
            MtaH5.clickStat('haoyouzhulimian',{'homeshare':'true'})//漏斗统计
            window.location.href = "bookDetail.html?activity_type=1&bookid=" + $(this).attr('data-bookid') + "&stage=第0期&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
        })
        //全部听书好友助力
        $(document).on('click', '.all_btn', function(e) {
            e.stopPropagation();
            e.cancelBubble = true;
            MtaH5.clickStat("all_share")//统计点击
            window.location.href = "bookDetail.html?activity_type=1&bookid=" + $(this).attr('data-bookid') + "&stage=第0期&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
        })

        $("#mine").click(function() {
            location.href = "mine.html";
        })
        $("#center").click(function() {
            location.href = "info.html";
        })
        $("#x5").click(function() {
            location.href = "http://debugx5.qq.com/";
        })

        $('.free_receive_btn').click(function(){
            //恢复滑动效果
            document.body.style.overflow = 'auto';
            window.removeEventListener('touchmove', _preventDefault);
            $('.activity-alertView').addClass('hide');
            window.location.href = "activity_freeReceive.html"
        })

        $('#activity_book').on('click', '.activity_bookimg', function(e) {
            e.stopPropagation();
            e.cancelBubble = true;
            //恢复滑动效果
            document.body.style.overflow = 'auto';
            window.removeEventListener('touchmove', _preventDefault);
            $('.activity-alertView').addClass('hide');
            window.location.href = "activity_freeReceive.html";
        })

        $('.follow-mask').click(function(){
            //恢复滑动效果
            document.body.style.overflow = 'auto';
            window.removeEventListener('touchmove', _preventDefault);
            $('.activity-alertView').addClass('hide');
            $('.newUser_activity').addClass('hide');
            location.reload();
            localStorage.setItem("refresh","1");
        });

        $('.closeBtn').click(function(){
            //恢复滑动效果
            document.body.style.overflow = 'auto';
            window.removeEventListener('touchmove', _preventDefault);
            $('.activity-alertView').addClass('hide');
            $('.newUser_activity').addClass('hide');
            localStorage.setItem("refresh","1");
            location.reload();
        });

        $('.activity_newUserImgView').click(function(){
            //恢复滑动效果
            document.body.style.overflow = 'auto';
            window.removeEventListener('touchmove', _preventDefault);
            $('.activity_newUserImgView').addClass('hide');

        });

        $('.activity_Advertisement').click(function(){
            $('.activity_Advertisement').addClass('hide');
            if (advertisement_dict.type == 1) {//会员
                location.href = "memberPage.html";
            }else if (advertisement_dict.type == 2) {//精品课
                location.href = "themeDetail.html?themeId=" + advertisement_dict.id;
            }else if (advertisement_dict.type == 3) {//书单
                location.href = "listDetail.html?themeId=" + advertisement_dict.id;
            }
        });

        $('.activity_VIPImgView').click(function(){
            //恢复滑动效果
            document.body.style.overflow = 'auto';
            window.removeEventListener('touchmove', _preventDefault);
            $('.activity-alertView').addClass('hide');
            location.href="memberPage.html"
        });

        $('#tabs div').on('click',function(){
            $('#tabs div').removeClass('active');
            $(this).addClass('active');

            var index = $(this).index();
            $('.category').removeClass('hide');
            $('.recommend').addClass('hide');
            cateBookArr = [];
            toast.loading({
                title: "加载中",
                duration: 2000
            });

            for (var i = 0; i < 6; i ++) {
                var id = "tab_" + i;
                if (index == i) {
                    document.getElementById(id).style.color="#333";
                    document.getElementById(id).style.fontWeight="bold";
                }else {
                    document.getElementById(id).style.color="#999";
                    document.getElementById(id).style.fontWeight="normal";
                }
            }

            var arr = ["1","11","3","9","10"];
            switch (index){
                case 0://推荐
                    $('.category').addClass('hide');
                    $('.recommend').removeClass('hide');
                    $('.book_price').css('float','left');
                    $('.all_btn').show()

                    toast.hide();
                    break;
                default://文化
                    $.ajax({
                        type:"get",
                        url:ascli(hostUrl + "home/classify?token=" + token + "&id=" + arr[index - 1]),
                        async:true,
                        success: function(data){
                            toast.hide();
                            if (data.status != 0) {
                                return;
                            }
                            cateArr = data.data;
                            for (var i = 0; i < cateArr.length; i ++) {
                                cateBookArr = cateBookArr.concat(cateArr[i].bookList);
                            }
                            cateArr.unshift({"name":"全部","bookList":cateBookArr});
                            data.cateArr = cateArr;
                            document.getElementById('TopCategory').innerHTML = template("TopCategory_Item", data);
                            document.getElementById("cate_0").style.background="#f8d44c";
                            data.userVip=userVip;
                            data.bookArr = cateBookArr;
                            var book_html = template("book_template", data);
                            document.getElementById('book_html1').innerHTML = book_html;

                            $('.all_btn').hide()
                            $('.book_price').css('float','right');
                        }
                    });
                    break;
            }
        })
    })

    $('#TopCategory').on('click', '.category_btn', function(e) {
        e.stopPropagation();
        e.cancelBubble = true;
        var index = $(".category_btn").index(this);
        for (var i = 0; i < cateArr.length; i ++) {
            var id = "cate_" + i;
            document.getElementById(id).style.background="white";
        }
        this.style.background = "#f8d44c";
        cateBookArr = cateArr[index].bookList;
        var data = {};
        data.userVip=userVip;
        data.bookArr = cateBookArr;
        var book_html = template("book_template", data);
        document.getElementById('book_html1').innerHTML = book_html;

        $('.all_btn').hide()
        $('.book_price').css('float','right');
    })

    var isPageHide = false;
    window.addEventListener('pageshow', function () {
        if (isPageHide) {
            location.reload()
        }
    });
    window.addEventListener('pagehide', function () {
        isPageHide = true;
    });

    function _preventDefault(e){
        e.preventDefault();
    }

    (function() {
        var mta = document.createElement("script");
        mta.src = "//pingjs.qq.com/h5/stats.js?v2.0.4";
        mta.setAttribute("name", "MTAH5");
        mta.setAttribute("sid", "500636065");
        mta.setAttribute("cid", "500636067");
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(mta, s);
    })();
</script>
